<template>
    <rx-dialog @handOk="handleUpload" @cancel="cancel">
        <rx-layout>
            <div slot="center">
                <a-form-model ref="form" :model="mdl" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
                    <a-form-model-item :label="i18n('form.name','名称')" prop="fileName">
                        <a-input :placeholder="i18n('form.name','名称')" v-model="mdl.fileName"/>
                    </a-form-model-item>
                    <a-form-model-item :label="i18n('form.isDefault','默认')" >
                        <a-checkbox @change="changeDefault" :checked="defaultChecked"></a-checkbox>
                    </a-form-model-item>
                    <a-form-model-item :label="i18n('form.signFile','签名文件')" prop="fileId">
                        <div class="clearfix" style="position: relative;">
                            <a-upload
                                accept=""
                                :multiple="true"
                                :file-list="fileList"
                                :before-upload="beforeFileUpload"
                                :remove="removeFile"
                                :customRequest="customUpload"
                            >
                                <a-button>
                                    <a-icon type="upload"/>
                                    {{i18n('form.uploadSign','上传签名')}}
                                </a-button>
                            </a-upload>
                        </div>
                    </a-form-model-item>
                </a-form-model>
            </div>
        </rx-layout>
    </rx-dialog>
</template>
<script>
import SysSignatureApi from '@/api/system/core/sysSignature'
import {RxDialog, BaseFormModel, Util} from "@lowcode/jpaas-common-lib";
import SysFileApi from "@/api/system/core/sysFile";


export default {
    name: 'SysSignatureEdit',
    mixins: [BaseFormModel],
    components: {
        RxDialog,
    },
    data() {
        return {
            rules: {
                fileId: [{required: false, message: this.i18n('msa.inputFileIdTips','请输入文件ID'), trigger: 'change'}],
                fileName: [{required: true, message: this.i18n('form.name','请输入名称','input'), trigger: 'change'}],
            },
            fileList:[],
            file:"",
            defaultChecked:false
        }

    },
    methods: {
        i18n(name,text,key){
            return this.$ti18(name,text,"SysSignature",key);
        },
        onload_(values) {
            if(values){
                this.fileList=[{
                    uid: values.fileId,
                    name: values.fileName,
                    status: 'done',
                    url: null
                }];
                this.defaultChecked=values.isDefault==1;
            }
        },
        get(id) {
            return SysSignatureApi.get(id);
        },
        save() {
            SysSignatureApi.save(this.mdl).then(res=>{
                Util.closeWindow(this, "ok");
            });
        },
        changeDefault(e){
            this.mdl.isDefault=e.target.checked?1:0;
            this.defaultChecked=e.target.checked;
        },
        beforeFileUpload(file) {
            let self=this;
            let type = (file.type).split("/")[0];
            if (type != "image") {
                alert(self.i18n('msa.fileTypeTips','只能上传图片'));
                return false;
            }
            if(self.fileList.length>0){
                self.$confirm({
                    content: self.i18n('msa.fileTypeTips','您确定要覆盖当前签名吗?'),
                    zIndex:40000,
                    okText: this.$ti18('rxForm.okBtn','确定'),
                    cancelText: this.$ti18('rxForm.cancelBtn','取消'),
                    onOk() {
                        self.fileList=[{
                            uid: file.uid,
                            name:self.mdl.fileName || file.name,
                            status: 'done',
                            url: null
                        }];
                        self.file=file;
                    }
                });
            }else {
                self.fileList=[{
                    uid: file.uid,
                    name:self.mdl.fileName || file.name,
                    status: 'done',
                    url: null
                }];
                self.file=file;
            }
            return true;
        },
        handleUpload(vm) {
            vm.loading = false ;
            this.$refs.form.validate(valid => {
                if (!valid) {
                    return;
                }
            });
            if(!this.file && this.fileList.length==0){
                this.$message.warning(this.i18n('msa.uploadSignTips','请上传签名！'));
                return;
            }else if(!this.file && this.fileList.length>0){
                this.save();
                Util.closeWindow(this, "ok");
                return ;
            }
            const formData = new FormData();
            let timestamp = new Date().getTime();
            formData.append('files', this.file);
            formData.append("time", Util.encryptWord(timestamp));
            this.fileAdd(formData);
        },
        async fileAdd(formData) {
            let self = this;
            await SysFileApi.upload(formData).then(res => {
                if (!res.success && res.data) return;
                self.mdl.fileId=res.data[0].fileId;
                self.save();
            });
        },
        removeFile() {
            this.fileList=[];
            this.file="";
        },
        //保存时上传
        customUpload(){},
        cancel() {
            Util.closeWindow(this, "cancel");
        }
    }
}
</script>
<style>
.relick a {
    margin-right: 10px;
}
.bulist {
    width: 110px;
    margin-right: 6px;
    position: relative;
}
.imgDiv .handBtn {
    position: absolute;
    top: 2px;
    right: 0;
    color: #000000;
}

.imgDiv .handBtn i:hover {
    color: #4d6aff;
}
</style>
